<!-- 拉新活动  -->
<template>
    <s-layout title="活动分享" :bgStyle="{ color: '#f2f2f2' }">
        <s-empty v-if="state.total === 0" icon="/static/coupon-empty.png" text="暂无数据"></s-empty>
        <view class="team-list">
            <view class="list-box" v-for="(item, index) in state.gameData" :key="index">
                <view class="img-box"  @click="btJump(item.id,item.image)">
                    <image class="img-img" :src="`${url}${item.image}`" mode="widthFix"></image>
                </view>
                <view class="content-box"  @click="btJump(item.id,item.image)">
                    <!-- <button class="mini-btn btn-btn" type="primary" size="mini">按钮</button> -->
                    <view class="content-box-text" @click="btJump(item.id,item.image)">
                        <view>{{ item.name }}</view>
                        <!-- <button open-type="share" class="contentShare">分享</button> -->
                    </view>
                    <view class="content-box-time">
                        <!-- {{ `${item.start_time} - ${item.end_time}` }} -->
						{{ `${getStrTime(item.start_time)} - ${getStrTime(item.end_time)}` }}
                    </view>
                </view>
            </view>
        </view>
        <uni-load-more v-if="state.total > 0" :status="state.loadStatus" :content-text="{
		contentdown: '上拉加载更多',
	}" tap="loadmore" />
    </s-layout>
</template>

<script setup>
    import {
        baseUrl
    } from '@/sheep/config';
    import sheep from '@/sheep';
    import {
        onLoad,
        onShow,
        onReachBottom
    } from '@dcloudio/uni-app';
    import {
        computed,
        reactive
    } from 'vue';
    import _ from 'lodash';
    const url = baseUrl.slice(0, baseUrl.lastIndexOf("index.php"))
    const state = reactive({
        loadStatus: '',
        total: 3,
        gameData: []
    });
	
	function getStrTime(str){
		let lastSpaceIndex = str.lastIndexOf(' ');
	    return lastSpaceIndex === -1 ? str : str.substring(0, lastSpaceIndex);
	}

    async function getData() {
        let {
            code,
            data
        } = await sheep.$api.game.laxinlist();
        if (code) {
            state.gameData = data;
        }
    }
    
    const shareData = computed(()=>{ // 分享的数据
    	return {
    		title: 'test',
    		desc: 'desc',
    		path: '/pages/news/detail?id=2',
    		imageUrl: ''
    	}
    }) 
    async function onSubmit(item) {
        sheep.$router.go('/pages/activity_beg/index', {
            checkinid: item.id,
            eventid: item.event_id
        });

    }
	function btJump(id,img) {
		uni.navigateTo({
			url: `/pages/Checkin/detail?eventid=${id}&url=${img}`
		})
	}

    onShow(() => {
        getData()
        uni.$mpShare = shareData.value // 修改uni.$mpShare的值

    })



    // async function getData(page = 1, list_rows = 5) {
    // 	state.loadStatus = 'loading';
    // 	const res = await sheep.$api.coupon.list({
    // 		list_rows,
    // 		page
    // 	});
    // 	if (res.code === 1) {
    // 		let couponlist = _.concat(state.pagination.data, res.data.data);
    // 		state.pagination = {
    // 			...res.data,
    // 			data: couponlist,
    // 		};
    // 		if (state.pagination.current_page < state.pagination.last_page) {
    // 			state.loadStatus = 'more';
    // 		} else {
    // 			state.loadStatus = 'noMore';
    // 		}
    // 	}
    // }

    // async function getCoupon(page = 1, list_rows = 5) {
    // 	state.loadStatus = 'loading';
    // 	let res = await sheep.$api.coupon.userCoupon({
    // 		type: state.type,
    // 		list_rows,
    // 		page,
    // 	});
    // 	if (res.code === 1) {
    // 		let couponlist = _.concat(state.pagination.data, res.data.data);
    // 		state.pagination = {
    // 			...res.data,
    // 			data: couponlist,
    // 		};
    // 		if (state.pagination.current_page < state.pagination.last_page) {
    // 			state.loadStatus = 'more';
    // 		} else {
    // 			state.loadStatus = 'noMore';
    // 		}
    // 	}
    // }

    // 加载更多
    function loadmore() {
        if (state.loadStatus !== 'noMore') {
            if (state.currentTab == 0) {
                getData(state.pagination.current_page + 1);
            } else {
                getCoupon(state.pagination.current_page + 1);
            }
        }
    }

    onReachBottom(() => {
        loadmore();
    });
</script>
<style lang="scss" scoped>
    .btn-zhuti-box {
        display: flex;
    }

    .btn-zhuti-box>button {
        margin-right: 10rpx;
    }

    .btn-zhuti-box>button:last-child {
        margin-right: 0;
    }

    .content-box {
        padding: 15rpx;
        flex-grow: 1;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        margin-left: 25rpx;
    }

    .team-list {
        padding: 25rpx 15rpx;
    }

    .list-box {
        display: flex;
        margin-bottom: 26rpx;
        background-color: #fff;
        padding: 10rpx;
        border-radius: 10rpx;
        flex-shrink: 0;
    }

    .img-box {
        flex-shrink: 0;
        width: 130rpx;
        height: 130rpx;
        margin-top: 10rpx;
    }

    .img-img {
        width: 100%;
        border-radius: 10rpx;
    }

    .content-box-text {
        margin-bottom: 30rpx;
        display: flex;
        flex-direction: row;
        align-items: center;
        position: relative;
        padding-right: 130rpx;
        .contentShare {
            position: absolute;
            right: 10rpx;
            top: 0rpx;
            width: 100rpx;
            height: 40rpx;
            font-size: 24rpx;
            padding: 0;
            line-height: 40rpx;
            margin: 0;
            background-color: green;
            color: #fff;
        }
    }

    .content-box-time {
        color: #c1c1c1;
        font-size: 24rpx;
        padding-bottom: 15rpx;
        /*border-bottom: 1rpx dashed #c1c1c1;*/
    }

    ::v-deep.uni-collapse-item__title.uni-collapse-item-border {
        border-bottom: none;
    }

    ::v-deep.uni-collapse-item__wrap-content.uni-collapse-item--border {
        border-bottom: none;
    }

    ::v-deep.uni-collapse-item__title-box {
        height: auto;
        line-height: 230%;
    }

    .collapse-box2 {
        line-height: 180%;
    }

    /*.btn-btn {
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	margin: 0;
}*/
</style>